<!DOCTYPE html>
<html lang="en">
<head>        
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />    
    <!--[if gt IE 8]>
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />        
    <![endif]-->                
    <title>Leo - Premium Admin Template</title>
    <link rel="icon" type="image/ico" href="favicon.ico"/>
    
    <link href="css/stylesheets.css" rel="stylesheet" type="text/css" />        
    
    <!--[if lte IE 7]>        
        <script type='text/javascript' src='js/other/lte-ie7.js'></script>
    <![endif]-->    
    
    <script type='text/javascript' src='js/jquery/jquery-2.0.0.min.js'></script>
    <script type='text/javascript' src='js/jquery/jquery-ui-1.10.3.custom.min.js'></script>
    <script type='text/javascript' src='js/jquery/jquery-migrate-1.1.1.min.js'></script>
    <script type='text/javascript' src='js/jquery/globalize.js'></script>
    
    <script type='text/javascript' src='js/bootstrap/bootstrap.min.js'></script>
    <script type='text/javascript' src='js/cookies/jquery.cookies.2.2.0.min.js'></script>
    
    <script type='text/javascript' src='js/mcustomscrollbar/jquery.mCustomScrollbar.concat.min.js'></script>
    <script type='text/javascript' src='js/charts/excanvas.min.js'></script>    
    <script type='text/javascript' src='js/charts/jquery.flot.js'></script>    
    <script type='text/javascript' src='js/charts/jquery.flot.stack.js'></script>    
    <script type='text/javascript' src='js/charts/jquery.flot.pie.js'></script>
    <script type='text/javascript' src='js/charts/jquery.flot.resize.js'></script>    
    
    <script type='text/javascript' src='js/sparklines/jquery.sparkline.min.js'></script>    

    <script type='text/javascript' src='js/scrollup/jquery.scrollUp.min.js'></script>
    
    <script type='text/javascript' src='js/plugins.js'></script>    
    <script type='text/javascript' src='js/actions.js'></script>
    <script type='text/javascript' src='js/charts.js'></script>    
</head>
<body>    
    
    <div id="wrapper">
        
        <div id="header">
            
            <div class="wrap">
                
                <a href="index.html" class="logo"></a>
                
                <div class="buttons fl">
                    <div class="item">
                        <a href="#" class="btn btn-primary btn-small c_layout">
                            <span class="i-layout-8"></span>                            
                        </a>
                    </div>
                    <div class="item">
                        <a href="#" class="btn btn-primary btn-small c_screen">
                            <span class="i-stretch"></span>                            
                        </a>
                    </div>                    
                </div>
                
                <div class="buttons">
                    <div class="item">
                        <a href="#" class="btn btn-primary btn-small">
                            <span class="i-cog"></span>
                        </a>
                        <div class="popup">
                            <div class="head">
                                <h2>Settings</h2>
                            </div>
                            <div class="content np">      
                                <div class="row-fluid">
                                    <div class="controls-row">
                                        <div class="span3">Themes:</div>
                                        <div class="span9 themes">
                                            <a href="#" class="default tip" data-theme="" title="Default"></a>
                                            <a href="#" class="dark tip" data-theme="themeDark" title="Dark"></a>
                                            <a href="#" class="simple tip" data-theme="themeSimple" title="Simple"></a>
                                            <div class="help-block">On click theme will changed and saved settings</div>
                                        </div>
                                    </div>               
                                    <div class="controls-row">
                                        <div class="span3">Backgrounds:</div>
                                        <div class="span9 backgrounds">
                                            <a href="#" class="default tip" data-theme="" title="Default"></a>                                            
                                            <a href="#" class="b_bcrosshatch" data-back="b_bcrosshatch"></a>
                                            <a href="#" class="b_crosshatch" data-back="b_crosshatch"></a>
                                            <a href="#" class="b_cube" data-back="b_cube"></a>
                                            <a href="#" class="b_dots" data-back="b_dots"></a>
                                            <a href="#" class="b_grid" data-back="b_grid"></a>
                                            <a href="#" class="b_hline" data-back="b_hline"></a>
                                            <a href="#" class="b_simple" data-back="b_simple"></a>
                                            <a href="#" class="b_vline" data-back="b_vline"></a>
                                            <div class="help-block">On click background will changed and saved settings</div>
                                        </div>
                                    </div>                                    
                                </div>
                            </div>
                            <div class="footer">
                                <div class="side fr">
                                    <button class="btn btn-primary popup-close">Close</button>
                                </div>                                
                            </div>
                        </div>                        
                    </div>
                    <div class="item">
                        <a href="#" class="btn btn-primary btn-small">
                            <span class="i-chat"></span>
                        </a>
                        <div class="popup">
                            <div class="head">
                                <h2>Messages</h2>
                            </div>
                            <div class="content npb messages minify" id="messages"></div>
                            <div class="footer">
                                <div class="side fl">
                                    <button class="btn btn-link">Show all</button>
                                </div>
                                <div class="side fr">
                                    <button class="btn btn-primary popup-close">Close</button>
                                </div>                                
                            </div>
                        </div>
                    </div>
                    <div class="item">                        
                        <div class="btn-group">                        
                            <a href="#" class="btn btn-primary btn-small dropdown-toggle" data-toggle="dropdown">
                                <span class="i-forward"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="#"><span class="i-profile"></span> Profile</a></li>
                                <li><a href="#"><span class="i-tools"></span> Controls</a></li>                                
                                <li><a href="#"><span class="i-locked"></span> Lock</a></li>
                                <li><a href="#"><span class="i-forward"></span> Logout</a></li>
                            </ul> 
                        </div>
                    </div>                
                </div>
                
            </div>
            
        </div>
        
        <div id="layout">
        
            <div id="sidebar">

                <div class="user">
                    <div class="pic">
                        <img src="img/examples/users/dmitry_m.jpg"/>
                    </div>
                    <div class="info">
                        <div class="name">
                            <a href="#">John Doe</a>
                        </div>
                        <div class="buttons">
                            <a href="#"><span class="i-cog"></span> Settings</a>
                            <a href="#"><span class="i-chat"></span> Messages</a>
                            <a href="#" class="fr"><span class="i-forward"></span> Logout</a>
                        </div>
                    </div>
                </div>

                <ul class="navigation">
                    <li class="active">
                        <a href="index.html">Dashboard</a>
                    </li>
                    <li class="openable">
                        <a href="#">UI Elements</a>
                        <ul>
                            <li>
                                <a href="ui_elements.html">Elements</a>
                            </li>
                            <li>
                                <a href="ui_widgets.html">Widgets</a>
                            </li>
                            <li>
                                <a href="ui_buttons.html">Buttons</a>
                            </li>
                            <li>
                                <a href="ui_icons.html">Icons</a>
                            </li>
                            <li>
                                <a href="ui_grid.html">Grid system</a>
                            </li>                        
                        </ul>
                    </li> 
                    <li class="openable">
                        <a href="#">Form Stuff</a>
                        <ul>
                            <li>
                                <a href="form_elements.html">Form elements</a>
                            </li>                            
                            <li>
                                <a href="form_validation.html">Form validation</a>
                            </li>                                                        
                            <li>
                                <a href="form_wizard.html">Wizard</a>
                            </li>
                            <li>
                                <a href="form_wysiwyg.html">WYSIWYG</a>
                            </li>
                            <li>
                                <a href="form_code_editor.html">Code editor</a>
                            </li>
                        </ul>                        
                    </li>                
                    <li>
                        <a href="messages.html">Messages</a>
                    </li>                                
                    <li>
                        <a href="charts.html">Charts</a>
                    </li>                                   
                    <li class="openable">                        
                        <a href="tables.html">Tables</a>
                        <ul>
                            <li>
                                <a href="tables_default.html">Default tables</a>
                            </li>
                            <li>
                                <a href="tables_sort.html">Sorting tables</a>
                            </li>
                            <li>
                                <a href="tables_edit.html">Editable tables</a>
                            </li>
                        </ul>
                    </li>                 
                    <li>
                        <a href="typography.html">Typography</a>                       
                    </li>                
                    <li>
                        <a href="files.html">File handling</a>                       
                    </li>
                    <li>
                        <a href="calendar.html">Calendar</a>                       
                    </li>                    
                    <li class="openable">
                        <a href="#">Maps</a>
                        <ul>
                            <li>
                                <a href="maps_vector.html">Vector maps</a>
                            </li>
                            <li>
                                <a href="maps_google.html">Google maps</a>
                            </li>                            
                        </ul>
                    </li>                    
                    <li class="openable">
                        <a href="#">Sample Pages</a>
                        <ul>
                            <li>
                                <a href="sample_login.html">Login</a>
                            </li>     
                            <li>
                                <a href="sample_user_edit.html">User edit</a>
                            </li>      
                            <li>
                                <a href="sample_search.html">Search result</a>
                            </li>      
                            <li>
                                <a href="sample_faq.html">FAQ</a>
                            </li>                   
                            <li>
                                <a href="sample_mailbox.html">Mailbox</a>
                            </li>
                            <li>
                                <a href="sample_invoice.html">Invoice</a>
                            </li>
                            <li>
                                <a href="sample_gallery.html">Gallery</a>
                            </li>
                            <li>
                                <a href="sample_blank.html">Blank page</a>
                            </li>
                            <li>
                                <a href="sample_price.html">Pricing table</a>
                            </li>
                            <li>
                                <a href="sample_payment.html">Payment table</a>
                            </li>                            
                            <li class="openable">
                                <a href="#">Error pages</a>
                                <ul>
                                    <li><a href="sample_error_403.html">Error 403 forbidden</a></li>
                                    <li><a href="sample_error_404.html">Error 404 not found</a></li>
                                    <li><a href="sample_error_503.html">Error 503 service unavailable</a></li>
                                </ul>
                            </li>                            
                        </ul>
                    </li>
                    <li class="openable">
                        <a href="#" class="icon"><span class="i-star text-info"></span>Navigation samples<span class="label label-important fr">+6</span></a>
                        <ul>
                            <li><a href="#" class="icon"><span class="i-battery text-error"></span>Second level<span class="label label-info fr">$35,224</span></a></li>                            
                            <li class="openable">
                                <a href="#" class="icon"><span class="i-cart text-success"></span>Second level<span class="label label-important fr">+3</span></a>
                                <ul>
                                    <li><a href="#" class="icon"><span class="i-film"></span>Third level<span class="label label-info fr">3</span><span class="label label-success fr">2</span><span class="label fr">1</span></a></li>
                                    <li class="active"><a href="#" class="icon"><span class="i-cube text-info"></span>Active third level<span class="label label-info fr">3</span><span class="label label-info fr">2</span><span class="label label-info fr">1</span></a></li>
                                    <li><a href="#" class="icon"><span class="i-info"></span>Third level<span class="label label-warning fr">3</span><span class="label label-important fr">2</span><span class="label fr">1</span></a></li>
                                </ul>
                            </li>                            
                            <li><a href="#" class="icon"><span class="i-box text-warning"></span>Second level<span class="label label-success fr">$1989.02</span></a></li>
                        </ul>
                    </li>                    
                </ul>

            </div>

            <div id="content">                        
                <div class="wrap">
                    
                    <div class="head">
                        <div class="info">
                            <h1>Dashboard</h1>
                            <ul class="breadcrumb">
                                <li><a href="#">Home</a> <span class="divider">-</span></li>
                                <li><a href="#">One more</a> <span class="divider">-</span></li>
                                <li class="active">Dashboard</li>
                            </ul>
                        </div>
                        
                        <div class="search">
                            <form action="" method="post">
                                <input type="text" placeholder="search..."/>                                
                                <button type="submit"><span class="i-calendar"></span></button>
                                <button type="submit"><span class="i-magnifier"></span></button>
                            </form>
                        </div>                        
                    </div>                                                                    
                    
                    <div class="content">
                        
                        <div class="row-fluid">
                            <div class="span6">    
                                <div class="widgets">
                                    <a href="ui_elements.html" class="button text-error">                                        
                                        <div class="icon">
                                            <i class="i-cube"></i>
                                        </div>
                                    </a>
                                    <a href="form_elements.html" class="button text-warning">
                                        <div class="icon">
                                            <i class="i-pencil"></i>
                                        </div>
                                    </a>                                    
                                    <a href="messages.html" class="button text-success">                                        
                                        <div class="icon">
                                            <i class="i-chat-4"></i>
                                        </div>
                                    </a>                                                                          
                                    <a href="charts.html" class="button">
                                        <div class="icon">
                                            <i class="i-chart-2"></i>
                                        </div>
                                    </a>
                                    <a href="typography.html" class="button text-info">                                        
                                        <div class="icon">
                                            <i class="i-info"></i>
                                        </div>
                                    </a>                                    
                                </div>                                
                                <div class="widgets">
                                    <a class="button text-error" href="#">
                                        <div class="icon">
                                            <span class="mChartBar" sparkWidth="100" sparkHeight="30" sparkType="bar" sparkBarColor="#b84b48">5,6,4,6,5,4,5,6,8,5,6</span>
                                        </div>
                                        <div class="info">
                                            <span>Sales</span>
                                            <p class="muted">Date: 05.06.2013</p>
                                            <p>Total: 102</p>
                                        </div>
                                    </a>
                                    <a class="button text-success" href="#">
                                        <div class="icon">
                                            <span class="mChartBar" sparkType="pie" sparkWidth="30" sparkHeight="30">170,532,75</span>
                                        </div>
                                        <div class="info">
                                            <span>Visitors</span>
                                            <p>New: 170;</p>
                                            <p>Returned: 532;</p>
                                        </div>
                                    </a>                                    
                                </div>
                                <div class="block">                                    
                                    <div class="content closed">
                                        <ul class="boxes nmt">
                                            <li>22,322 <span>Amount paid</span></li>
                                            <li>1,600 <span>In queue</span></li>
                                            <li>23,922 <span>Total taxes</span></li>
                                        </ul>
                                        <div class="progress progress-info progress-small fl" style="width: 100%;">
                                            <div class="bar tip" title="80%" style="width: 80%"></div>
                                        </div>                                        
                                        <div class="fl" style="width: 100%;">
                                            <button class="btn btn-primary btn-block">VIEW ALL TRANSACTIONS</button>
                                        </div>                                        
                                    </div>
                                </div>                                  
                            </div>
                            <div class="span6">
                                <div class="block">
                                    <div class="head">
                                        <h2>Activity</h2>
                                        <ul class="buttons">                                            
                                            <li><a href="#" class="block_toggle"><span class="i-arrow-down-3"></span></a></li>
                                            <li><a href="#" class="block_remove"><span class="i-cancel-2"></span></a></li>
                                        </ul>                                         
                                    </div>
                                    <div class="content">
                                        <div id="chart-4" style="height: 200px;"></div>
                                    </div>                                    
                                </div>                                
                            </div>                            
                        </div>
                        
                        <div class="row-fluid">
                            <div class="span6">
                                <div class="block">
                                    <div class="head">
                                        <h2>Latest orders</h2>                                        
                                        <ul class="buttons">
                                            <li><a href="#" class="block_loading"><span class="i-cycle"></span></a></li>
                                            <li><a href="#" class="block_toggle"><span class="i-arrow-down-3"></span></a></li>
                                            <li><a href="#" class="block_remove"><span class="i-cancel-2"></span></a></li>
                                        </ul>                                        
                                        <div class="side fr">
                                            <span class="label label-important">+2</span>
                                        </div>                                        
                                    </div>                                                                    
                                    <div class="content np">
                                        <table cellpadding="0" cellspacing="0" width="100%" class="list">
                                            <thead>
                                                <tr>
                                                    <th width="50">Date</th>
                                                    <th>Products</th>
                                                    <th width="40">Status</th>
                                                    <th width="50">Price</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td><span class="date">Nov 17</span><span class="time">12:35</span></td>
                                                    <td><a href="#">Order #15-223</a></td>
                                                    <td><span class="label label-important">waiting</span></td>
                                                    <td><span class="price">$139.13</span></td>
                                                </tr>                                                 
                                                <tr>
                                                    <td><span class="date">Nov 15</span><span class="time">12:35</span></td>
                                                    <td><a href="#">Order #15-222</a></td>
                                                    <td><span class="label label-important">waiting</span></td>
                                                    <td><span class="price">$678.00</span></td>
                                                </tr>                                                
                                                <tr>
                                                    <td><span class="date">Nov 14</span><span class="time">12:35</span></td>
                                                    <td><a href="#">Order #15-221</a></td>
                                                    <td><span class="label label-warning">delivering</span></td>
                                                    <td><span class="price">$400.12</span></td>
                                                </tr>
                                                <tr>
                                                    <td><span class="date">Nov 14</span><span class="time">18:42</span></td>
                                                    <td><a href="#">Order #15-220</a></td>
                                                    <td><span class="label label-success">done</span></td>
                                                    <td><span class="price">$800.00</span></td>
                                                </tr>
                                                <tr>
                                                    <td><span class="date">Nov 13</span><span class="time">8:21</span></td>
                                                    <td><a href="#">Order #15-219</a></td>
                                                    <td><span class="label label-success">done</span></td>
                                                    <td><span class="price">$879.24</span></td>
                                                </tr>                                                                                  
                                            </tbody>
                                            <tfoot>
                                                <tr>
                                                    <td colspan="4" align="right"><button class="btn btn-small btn-primary">More...</button></td>
                                                </tr>
                                            </tfoot>
                                        </table>
                                    </div>                                                                        
                                </div>                                
                            </div>
                            <div class="span6">
                                <div class="block">
                                    <div class="head">
                                        <h2>Stuff</h2>
                                        <div class="side fr">
                                            <div class="input-append">
                                                <input type="text" placeholder="Search..." class="input-small"/>
                                                <button class="btn" type="button"><i class="i-magnifier"></i></button>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="content list_custom npb npt">
                                        <div class="item">
                                            <div class="img">
                                                <img src="img/examples/users/dmitry_m.jpg" class="img-polaroid"/>
                                            </div>
                                            <div class="info">
                                                <a href="#" class="name">John Doe</a>
                                                <p class="muted">Developer</p>
                                            </div>
                                            <div class="status online"></div>
                                        </div>
                                        <div class="item">
                                            <div class="img">
                                                <img src="img/examples/users/olga_m.jpg" class="img-polaroid"/>
                                            </div>
                                            <div class="info">
                                                <a href="#" class="name">Olga Ivaniuk</a>
                                                <p class="muted">Manager</p>
                                            </div>
                                            <div class="status online"></div>
                                        </div>
                                        <div class="item">
                                            <div class="img">
                                                <img src="img/examples/users/alexey_m.jpg" class="img-polaroid"/>
                                            </div>
                                            <div class="info">
                                                <a href="#" class="name">Alex Kucher</a>
                                                <p class="muted">Manager</p>
                                            </div>
                                            <div class="status away"></div>
                                        </div>                                        
                                        <div class="item">
                                            <div class="img">
                                                <img src="img/examples/users/helen_m.jpg" class="img-polaroid"/>
                                            </div>
                                            <div class="info">
                                                <a href="#" class="name">Helen Symonchuk</a>
                                                <p class="muted">Customer</p>
                                            </div>
                                            <div class="status offline"></div>
                                        </div>
                                        <div class="item">
                                            <div class="img">
                                                <img src="img/examples/users/vasil_m.jpg" class="img-polaroid"/>
                                            </div>
                                            <div class="info">
                                                <a href="#" class="name">Dmitry Kvasha</a>
                                                <p class="muted">Developer</p>
                                            </div>
                                            <div class="status offline"></div>
                                        </div>                                         
                                        <div class="item">
                                            <div class="img">
                                                <img src="img/examples/users/valentin_m.jpg" class="img-polaroid"/>
                                            </div>
                                            <div class="info">
                                                <a href="#" class="name">Valentin Ratushev</a>
                                                <p class="muted">Lawyer</p>
                                            </div>
                                            <div class="status offline"></div>
                                        </div>                                        
                                    </div>
                                    <div class="footer">
                                        <div class="side fr">
                                            <button class="btn btn-small btn-primary">More...</button>
                                        </div>
                                    </div>
                                </div>                                
                            </div>                            
                        </div>                        
                        
                        <div class="row-fluid">
                            
                            <div class="span12">
                                <div class="block">
                                    <div class="head">
                                        <h2>Chat</h2>                                        
                                        <ul class="buttons">
                                            <li><a href="#" class="block_loading"><span class="i-cycle"></span></a></li>
                                            <li><a href="#" class="block_toggle"><span class="i-arrow-down-3"></span></a></li>
                                            <li><a href="#" class="block_remove"><span class="i-cancel-2"></span></a></li>
                                        </ul>                                        
                                        <div class="side fr">
                                            <span class="label label-success">+4</span>
                                        </div>                                        
                                    </div>
                                    <div class="content messages npr">
                                        <div class="scroll" style="height: 180px;">
                                            <div class="item">
                                                <div class="img">
                                                    <img src="img/examples/users/dmitry_m.jpg" class="img-polaroid"/>
                                                </div>
                                                <div class="info">
                                                    <a href="#" class="name">John Doe</a> <span class="muted">14:34 03.06.2013</span>
                                                    <div class="text">
                                                        Mauris suscipit dolor ultrices purus mollis accumsan. Donec sit amet orci at justo ultricies dignissim.<br/>
                                                        Maecenas sagittis turpis sit amet risus congue ac luctus ligula pulvinar. Suspendisse a tellus enim. Nam ultrices neque ut elit sagittis et porta risus porttitor.                                                        
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="item">
                                                <div class="img right">
                                                    <img src="img/examples/users/olga_m.jpg" class="img-polaroid"/>
                                                </div>
                                                <div class="info">
                                                    <a href="#" class="name">Olga Ivaniuk</a> <span class="muted">14:30 03.06.2013</span>
                                                    <div class="text">
                                                        Quisque ullamcorper rutrum tortor, ac egestas dui rhoncus at.<br/> 
                                                        Suspendisse nibh neque, suscipit et vestibulum ut, ultricies blandit enim. Donec libero magna, consectetur...<br/>
                                                        Amet risus congue ac luctus ligula pulvinar...
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="item">
                                                <div class="img">
                                                    <img src="img/examples/users/dmitry_m.jpg" class="img-polaroid"/>
                                                </div>
                                                <div class="info">
                                                    <a href="#" class="name">John Doe</a> <span class="muted">12:22 03.06.2013</span>
                                                    <div class="text">
                                                        Mauris suscipit dolor ultrices purus mollis accumsan. Donec sit amet orci at justo ultricies dignissim.<br/>
                                                        Maecenas sagittis turpis sit amet risus congue ac luctus ligula pulvinar. Suspendisse a tellus enim. Nam ultrices neque ut elit sagittis et porta risus porttitor. 
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="item">
                                                <div class="img right">
                                                    <img src="img/examples/users/olga_m.jpg" class="img-polaroid"/>
                                                </div>
                                                <div class="info">
                                                    <a href="#" class="name">Olga Ivaniuk</a> <span class="muted">12:10 03.06.2013</span>
                                                    <div class="text">
                                                        Quisque ullamcorper rutrum tortor, ac egestas dui rhoncus at.<br/> 
                                                        Suspendisse nibh neque, suscipit et vestibulum ut, ultricies blandit enim. Donec libero magna, consectetur...
                                                    </div>
                                                </div>
                                            </div>     
                                        </div>
                                    </div>
                                    <div class="footer">
                                        <div class="side npb">
                                            <textarea class="input-block-level" placeholder="Message..."></textarea>                                                                                       
                                        </div>
                                        <div class="side fr npt">
                                            <button class="btn btn-primary">Send</button>                                           
                                        </div>
                                    </div>
                                </div>                                
                            </div>
                        </div>
                        
                    </div>
                        
                </div>
            </div>
            
        </div>

    </div>
    
</body>
</html>
